//入口文件
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const VueLoaderPlugin = require('vue-loader/lib/plugin');
//使用node模块化操作，向外暴露一个配置对象
module.exports = {
//入口文件配置，将指定文件通过webpack打包成入口文件
    entry: './src/main.js',
//配置出口文件信息
    output : {
        filename : 'bundle.js',
        path : path.resolve(__dirname,'dist')
    },
//配置插件信息
    plugins : [
        new HtmlWebpackPlugin({
            template : './src/index.html'
        }),
        new CleanWebpackPlugin(),
        new VueLoaderPlugin()
    ],
//配置本地服务器端口
    devServer : {
        contentBase : './dist',
        port : 3000
    },
//配置加载器
    module : {
        rules : [
          {
              test : /\.css$/,
              use : ['style-loader','css-loader']
          },
          {
              test : /\.(jpg|png|svg|gif|jpeg)$/,
              use : ['file-loader']
          },
          {
              test : /\.(woff|woff2|eot|ttf|otf)$/,
              use : ['file-loader']
          },
          {
              test : /\.vue$/,
              use : ['vue-loader']
          },
          {
              test : /\.scss$/,
              use : ['style-loader','css-loader','sass-loader']
          },
          {
              test : /.\js$/,
              use : ['babel-loader'],
              exclude : /node_modules/
          }
        ]
    }
}
